Server Side Rendering
Right now, you have a working CLI based TODO app. However you noticed that sometimes you need to access these tasks from your mobile phone or your tablet. In order to do that you need to be able to access your computer from different devices. This means that you need a some kind of server that will be always be running and accessible from the internet. In this challange, you will implement a server side rendered TODO app. This means that you will have a server that will be running on a remote machine and you will be able to access it from your mobile phone, tablet or any other device that has a browser. You will be able to add, delete, update and list your tasks from your browser.
HTTP Server
In order to serve your web page, you need a HTTP server. A HTTP server is a program that listens for HTTP requests and
sends HTTP responses. There are a lot of HTTP servers. We will use express.js in this challange. Express.js is a
framework that is built on top of node.js. A sample express.js server:
const express = require('express');
const app = express();
app.get('/', (req, res) => {
res.send('<h1>Hello World</h1>');
});
app.listen(3000, () => {
console.log('Server is listening on port 3000');
});
Html Forms
An HTML Form (form) is a simple way to collect input from user. Most commonly input is sent to a server to be
processed. form element supports common input UI component types such as text, checkbox, radio. Then the values
written by the user can be submitted to a server with the submit element.
Template Engine
In order to create dynamic web pages, you need to use a template engine. A template engine is a program that is used to
create HTML documents. It takes a template and some data and creates an HTML document according to the template. There
are a lot of template engines. We will use handlebars in this challange. A sample handlebars template:
<h1>{%title%}</h1>
<ul>
{%#each tasks%}
<li>{%this%}</li>
{%/each%}
</ul>
XSS Attack
Cross-Site Scripting (XSS) is a security vulnerability in web applications where untrusted data is improperly included in web page content, enabling malicious code execution in the context of other users' web browsers. This vulnerability occurs when web applications fail to adequately validate or sanitize input data, allowing an attacker to inject and execute code that can steal information, manipulate user sessions, or perform unauthorized actions on the affected website.